¡Hola 👋! Espera mientras comienza la sesión.
Antes que todo, ¿cómo están?
Visualización de Información
IIC2026 2021-2
Posicionamiento dirigido por fuerzas en D3.js
Visualización de Información
IIC2026 2021-2
Contenido
Contenido
1. d3-force
2. Fuerzas
3. Reactivación de simulación
¡Actividad grupal!
Cada grupo asignado a una Sala de Zoom debe completar en conjunto un programa de JavaScript que extiende un documento HTML. Los objetivos a lograr como grupo son:
- Escribir una lista no ordenada en el documento HTML con los nombres de las personas que forman el grupo.
- El primer objetivo es agregar puntos para cada nodo y líneas para cada enlace, que se actualicen con el funcionamiento de la simulación.
- El segundo es codificar el atributo “color” de los nodos mediante el color de relleno usando el valor del atributo, y codificar mediante el radio de los nodos el atributo “valor”. Los valores máximos y mínimos de radio quedan a su criterio.
- Luego, explorar las fuerzas que están en la simulación y ajustar sus configuraciones para que la red en cuestión sea completamente visible y o muy enredada. Pueden también explorar una fuerza nueva: forceRadial.
- Luego pueden personalizar como quieran.
¡Actividad grupal!
Les recomendamos que por grupo asignen:
- Al menos una persona que tenga el material del curso y documentación de D3.js a mano para consultarla.
- Al menos una persona pendiente de las dudas que surjan para solicitar ayuda durante la actividad.
- Al menos una persona que se encargue de escribir y extender el documento HTML y programa JavaScript.
- El resto puede apoyar a quienes escriban o a otros roles.
¡Actividad grupal!
Para colaborar en el código, pueden:
- Colaborar en Coding Rooms
- Colaborar en JSFiddle
- Colaborar en Liveweave
- Encargar a una persona que comparta pantalla y escriba.
El equipo docente les preparó salas en Coding Rooms. Para ingresar y colaborar deben entrar a un enlace y luego:
- Por defecto, entrarán a la sala solo con permiso de lectura, por lo que un ayudante les asignará el rol de editor a les primeres que entren.
- Si ya tienen rol de editor, pueden darle este rol a otros estudiantes. Para ello:
- Presionen el botón ‘Share’ en la parte superior derecha.
- En el cuadro desplegado, cambia el rol de todes les ‘Viewer’ a ‘Editor’ (Si no salen en el cuadro desplegado, recarguen la página)
- Para poder ver cómo va quedando su código, despliguen la vista de navegador en el botón ‘View Webpage’ de la parte inferior derecha.
- ¡Listo! Ya pueden ponerse a trabajar conjuntamente en su HTML y SVG.
¡Actividad grupal!
Salas y documentos asignados:
- Sala 1: Documento en Coding Room
- Sala 2: Documento en Coding Room
- Sala 3: Documento en Coding Room
- Sala 4: Documento en Coding Room
- Sala 5: Documento en Coding Room
- Sala 6: Documento en Coding Room
- Sala 7: Documento en Coding Room
- Sala 8: Documento en Coding Room
- Sala 9: Documento en Coding Room
- Sala 10: Documento en Coding Room
Resultados de actividad grupal
¡Visualización del día!
Visualización interactiva creada por ex-estudiante del curso Valeria Riquelme sobre el amor y la felicidad en el mundo.
Propuesta por... ¡mi!.
(Fuente: Sobre el Amor... y su relación con la Felicidad - Salón de la fama InfoVis 2020 )
Próximos eventos:
Estamos en plazo de realización de Hito 2, el que termina este jueves 11 de noviembre.
Se vienen sesiȯn sobre: Abstracción de tareas (jueves 11).
Jueves 11 de noviembre se publica el Examen.